/*------------------------------*\
    Grid System
\*------------------------------*/

.row, 
.column {
    box-sizing: border-box;
}

.row:before,
.row:after {
    content: " ";
    display: table;
}

.row:after {
    clear: both;
}

.column {
    position: relative;
    float: left;
    display: block;
}

.column + .column {
    margin-left: 1.6%;
}

.column-1 {
    width: 6.86666666667%;
}

.column-2 {
    width: 15.3333333333%;
}

.column-3 {
    width: 23.8%;
}

.column-4 {
    width: 32.2666666667%;
}

.column-5 {
    width: 40.7333333333%;
}

.column-6 {
    width: 49.2%;
}

.column-7 {
    width: 57.6666666667%;
}

.column-8 {
    width: 66.1333333333%;
}

.column-9 {
    width: 74.6%;
}

.column-10 {
    width: 83.0666666667%;
}

.column-11 {
    width: 91.5333333333%;
}

.column-12 {
    width: 100%;
    margin-left: 0;
}

@media only screen and (max-width: 700px) {
    .column-1, 
    .column-2, 
    .column-3, 
    .column-4, 
    .column-5, 
    .column-6, 
    .column-7, 
    .column-8, 
    .column-9, 
    .column-10, 
    .column-11, 
    .column-12 {
        float: none;
        width: auto;
    }
  
    .column + .column {
        margin-left: 0;
    }
}

/*------------------------------*\
    Styling
\*------------------------------*/

html {
         height:100%; /* fix height to 100% for IE */
         max-height:100%; /* fix height for other browsers */
         padding:0; /*remove padding */
         margin:0; /* remove margins */

}

body {
         height:100%;
         max-height:100%;
         min-width:400px;
         overflow:auto;
         padding:0px;
         margin:0;
         background:#000000;
}

.column {
    background: none;
    min-height: 20px;
    min-width:80px;
    text-align: center;

}

.column-block {
    background: #00E000;
    border: 3px double black;
    padding: 3px;
    border-radius: 3px;
}

.netil-block {
    background: #302323;
    border: 3px double white;
    padding: 3px;
    border-radius: 3px;
}


.column-pod {
    background: #FAF4E6;
    border: 1px solid black;
    padding:3px;
    border-radius: 3px;
}

.column-part {
    background: none;
    border: none;
}

.column-strong {
    font-weight:bold;
}

.column-italic {
    font-style:italic;
}

.column-text {

    background: #FAF4E6;
}

.column-title {
   font-size: 20px;
   font-weight:bold;
   background: #FAF4E6;
}

.column-border {
   border:1px solid black;
}

.column-double {
    border: 3px double black;
    padding: 3px;
    border-radius: 3px;
}

.row {
    margin-bottom: 3px;
    width:100%;
}

.row:last-child {
    margin-bottom: 0;
}

.p {
  font-size: 14px;
  text-align: center;
  padding-top: 100px;
}

/*How "a href" links are formatted*/
a:link {color:#770000; text-decoration: underline; font-weight:bold;}
a:active {color:#AA3333; text-decoration: underline; font-weight:bold;}
a:visited {color:#AA3333; text-decoration: underline; font-weight:bold;}
a:hover {color:#FF7777; text-decoration: none; font-weight:bold;}

/*Image scaling*/
img {
	max-width: 100%;
	height: auto;
	}

/*------------------------------*\
    Bars
\*------------------------------*/

    /*Wrapper containing main content, navigation,  white bar w/ logo, news feed, and main content*/
    #page-wrap
    {
        width: 100%;
        min-height: 100%;
        float: left;
        position: relative;
        background:#FAF4E6;
    }
    

    /*Navigation wrapper containing white bar w/ logo and main navigation*/
    #head-wrap
    {
        width: 100%;
        height: 40px;
        position: relative;
        top: 0;
        margin:0;
        background:#00E000;
        display:block;
    }
    
        /*Navigation wrapper containing white bar w/ logo and main navigation*/
    #head-wrap-netil
    {
        width: 100%;
        height: 40px;
        position: relative;
        top: 0;
        margin:0;
        background:#302323;
        display:block;
    }



    /*content block*/
    #content-wrap
    {
        overflow:auto;
        background: #FAF4E6;
        padding:15px;
        margin: 0 0 1.5em 0;
        
    }
    


    /*Main footer*/
    #footer-wrap
    {
        position: absolute;
        bottom: 0px;
        left: 0px;
        width: 100%;
        background: #00E000;
        height: 25px;
    }

#footer-wrap ul {
          margin:0;
          margin-left:20px;
          padding:0;
          background:transparent;
          height:100%;
          padding-left:20px;
          display:inline;
}
#footer-wrap ul li {  display:inline; list-style-type:none;list-style:none;}
#footer-wrap ul li a { padding-left:10px;  color:#000000; text-decoration:none; font-weight:normal; display:inline-block;}
#footer-wrap ul li a:hover { color:#000000; font-weight:bold; }

#logo a {
            background: url("Icons/logo.png") no-repeat scroll 6px 2px transparent;
            color: #00E000;
            display: block;
            height: 100%;
            margin-right: 5px;
            outline: medium none;
            text-indent: -9999px;
            width: 60px;
            float:left;
}

#head-wrap ul {
          margin:0;
          padding:0;
          background:transparent;
          height:100%;
          margin-left:20px;
          padding-left:20px;
          padding-top:10px;
          display:inline;
}
#head-wrap ul li {  display:inline; list-style-type:none; list-style:none;}
#head-wrap ul li a { padding-left:10px;  color:#000000; text-decoration:none; font-weight:normal; display:inline-block;}
#head-wrap ul li a:hover { color:#000000; font-weight:bold; }

/* --- Device Compatability --- */

@media only screen and (max-width: 700px) {
    .row {
        margin-bottom: 3px;
    }
    .column {
        margin-bottom: 3pxpx;
    }
}